<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>百度地图个性化</title>
    <script src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=iBZR31g3G73oIla9SkX7OIOiUrB1ynmT"></script>
    <style>
      body,
      html,
      #allmap {
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100%;
      }
      ul,
      li {
        list-style: none;
      }
      .info {
        position: absolute;
        left: 10px;
        top: 10px;
        color: #fff;
        z-index: 100000;
        width: 300px;
        height: 40px;
      }
    </style>
  </head>
  <body>
    <div id="allmap"></div>
    <a
      href="https://lbsyun.baidu.com/index.php?title=open/custom"
      target="_blank"
      class="info"
      >百度个性化地图</a
    >
    <script>
      let map = null;
      let styleJson1 = [
        {
          featureType: "land",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#091220ff"
          }
        },
        {
          featureType: "water",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#113549ff"
          }
        },
        {
          featureType: "green",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#0e1b30ff"
          }
        },
        {
          featureType: "building",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "building",
          elementType: "geometry.topfill",
          stylers: {
            color: "#113549ff"
          }
        },
        {
          featureType: "building",
          elementType: "geometry.sidefill",
          stylers: {
            color: "#143e56ff"
          }
        },
        {
          featureType: "building",
          elementType: "geometry.stroke",
          stylers: {
            color: "#dadada00"
          }
        },
        {
          featureType: "subwaystation",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#113549B2"
          }
        },
        {
          featureType: "education",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "medical",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "4"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#fed66900"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "2"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffeebb00"
          }
        },
        {
          featureType: "arterial",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "arterial",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "arterial",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "local",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "1"
          }
        },
        {
          featureType: "local",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "local",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "local",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "local",
          elementType: "labels.text.fill",
          stylers: {
            color: "#979c9aff"
          }
        },
        {
          featureType: "local",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "railway",
          elementType: "geometry",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            weight: "1"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry.fill",
          stylers: {
            color: "#d8d8d8ff"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "subway",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "subway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#979c9aff"
          }
        },
        {
          featureType: "subway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "continent",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "city",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "city",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "city",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "city",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "town",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "town",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "town",
          elementType: "labels.text.fill",
          stylers: {
            color: "#454d50ff"
          }
        },
        {
          featureType: "town",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "road",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "districtlabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "road",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "road",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "road",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "district",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "manmade",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "districtlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "entertainment",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "shopping",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "village",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff10"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "estate",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspotsway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "scenicspotsway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "universityway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "universityway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "vacationway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "vacationway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportation",
          elementType: "geometry",
          stylers: {
            color: "#113549ff"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportation",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "transportation",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medical",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "medical",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "background",
          elementType: "geometry",
          stylers: {
            color: "#1d3146ff"
          }
        }
      ];
      let styleJson2 = [
        {
          featureType: "land",
          elementType: "geometry",
          stylers: {
            color: "#fffff9ff"
          }
        },
        {
          featureType: "water",
          elementType: "geometry",
          stylers: {
            color: "#69b0acff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.fill",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#94ad79ff"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.fill",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.fill",
          stylers: {
            color: "#d4e2c6ff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.fill",
          stylers: {
            color: "#d4e2c6ff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.fill",
          stylers: {
            color: "#d4e2c6ff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.fill",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.fill",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "railway",
          elementType: "geometry",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#94ad79ff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.stroke",
          stylers: {
            color: "#b5caa0ff"
          }
        },
        {
          featureType: "highway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "provincialway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "provincialway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "8-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "entertainment",
          elementType: "geometry",
          stylers: {
            color: "#e4f0d7ff"
          }
        },
        {
          featureType: "manmade",
          elementType: "geometry",
          stylers: {
            color: "#effcf0ff"
          }
        },
        {
          featureType: "education",
          elementType: "geometry",
          stylers: {
            color: "#e3f7e4ff"
          }
        },
        {
          featureType: "building",
          elementType: "geometry.stroke",
          stylers: {
            color: "#a1cfa4ff"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.fill",
          stylers: {
            color: "#7a7a7aff"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text",
          stylers: {
            fontsize: "26"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text.fill",
          stylers: {
            color: "#afafafff"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text",
          stylers: {
            fontsize: "26"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#376b6dff"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff",
            weight: "4"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.fill",
          stylers: {
            color: "#376b6dff"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff",
            weight: "3"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.fill",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text",
          stylers: {
            fontsize: "24"
          }
        }
      ];
      let styleJson3 = [
        {
          featureType: "land",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#091220ff"
          }
        },
        {
          featureType: "water",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#113549ff"
          }
        },
        {
          featureType: "green",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#0e1b30ff"
          }
        },
        {
          featureType: "building",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "building",
          elementType: "geometry.topfill",
          stylers: {
            color: "#0898fb33" //0898fb33
          }
        },
        {
          featureType: "building",
          elementType: "geometry.sidefill",
          stylers: {
            color: "#143e56ff" //143e56ff
          }
        },
        {
          featureType: "building",
          elementType: "geometry.stroke",
          stylers: {
            color: "#fffffff33" //#dadada00
          }
        },
        {
          featureType: "subwaystation",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#113549B2"
          }
        },
        {
          featureType: "education",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "medical",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "4"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#fed66900"
          }
        },
        {
          featureType: "highway",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "2"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "arterial",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffeebb00"
          }
        },
        {
          featureType: "arterial",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "arterial",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21" /*2dc4bbff*/
          }
        },
        {
          featureType: "arterial",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "local",
          elementType: "geometry",
          stylers: {
            visibility: "on",
            weight: "1"
          }
        },
        {
          featureType: "local",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "local",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "local",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "local",
          elementType: "labels.text.fill",
          stylers: {
            color: "#979c9aff"
          }
        },
        {
          featureType: "local",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "railway",
          elementType: "geometry",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            weight: "1"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry.fill",
          stylers: {
            color: "#d8d8d8ff"
          }
        },
        {
          featureType: "subway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "subway",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "subway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#979c9aff"
          }
        },
        {
          featureType: "subway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "continent",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "continent",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "city",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "city",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "city",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "city",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "town",
          elementType: "labels.icon",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "town",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "town",
          elementType: "labels.text.fill",
          stylers: {
            color: "#454d50ff"
          }
        },
        {
          featureType: "town",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "road",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "districtlabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "road",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "road",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "road",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "district",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "poilabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "manmade",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "districtlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffffff"
          }
        },
        {
          featureType: "entertainment",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "shopping",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          stylers: {
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "10",
            curZoomRegionId: "0",
            curZoomRegion: "6-10"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          stylers: {
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "6",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "7",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "8",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels",
          stylers: {
            visibility: "off",
            level: "9",
            curZoomRegionId: "0",
            curZoomRegion: "6-9"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "subwaylabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "tertiarywaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "provincialwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "nationalwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "highwaysign",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "village",
          elementType: "labels",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bbff"
          }
        },
        {
          featureType: "district",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "country",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "water",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff10"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "highway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "nationalway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "provincialway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text",
          stylers: {
            fontsize: "20"
          }
        },
        {
          featureType: "cityhighway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "estate",
          elementType: "geometry",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "tertiaryway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspotsway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "scenicspotsway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "universityway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "universityway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "vacationway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "vacationway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.fill",
          stylers: {
            color: "#12223dff"
          }
        },
        {
          featureType: "fourlevelway",
          elementType: "geometry.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "transportationlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels",
          stylers: {
            visibility: "on"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "educationlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportation",
          elementType: "geometry",
          stylers: {
            color: "#113549ff"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medicallabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "scenicspotslabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "airportlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "entertainmentlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "estatelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "businesstowerlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "companylabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "governmentlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "restaurantlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "hotellabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "shoppinglabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "lifeservicelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "carservicelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "financelabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "otherlabel",
          elementType: "labels.icon",
          stylers: {
            visibility: "off"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "manmade",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "transportation",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "transportation",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "education",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "medical",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "medical",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "labels.text.fill",
          stylers: {
            color: "#2dc4bb21"
          }
        },
        {
          featureType: "scenicspots",
          elementType: "labels.text.stroke",
          stylers: {
            color: "#ffffff00"
          }
        }
      ];
      initMap();
      /**地图初始化**/
      function initMap() {
        map = new window.BMapGL.Map("allmap"); //创建地图
        map.enableDragging(); //启用拖拽功能
        map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
        map.centerAndZoom(new BMapGL.Point(117.217157, 39.24503), 15);
        map.setDisplayOptions({
          skyColors: ["rgba(186, 0, 255, 0)", "rgba(11,18,34, 0.2)"]
        }); //设置天空颜色
        map.setHeading(64.5); // 设置地图旋转角度
        map.setTilt(73); // 设置地图的倾斜角度
        let scaleCtrl = new BMapGL.ScaleControl(); // 添加比例尺控件
        map.addControl(scaleCtrl);
        let zoomCtrl = new BMapGL.ZoomControl(); // 添加缩放控件
        map.addControl(zoomCtrl);
        let navi3DCtrl = new BMapGL.NavigationControl3D(); // 添加3D控件
        map.addControl(navi3DCtrl);
        // 创建城市选择控件
        let cityControl = new BMapGL.CityListControl({
          // 控件的停靠位置（可选，默认左上角）
          anchor: BMAP_ANCHOR_TOP_RIGHT,
          // 控件基于停靠位置的偏移量（可选）
          offset: new BMapGL.Size(10, 5)
        });
        // 将控件添加到地图上
        map.addControl(cityControl);
        map.setMapStyleV2({
          styleJson: styleJson1
        });
      }
    </script>
  </body>
</html>
